<!-- 文档底部切换栏 -->
<template>
	<div style="position: relative;width: 55vw !important;" class="w-100 container">
		<div style="position:relative ;bottom: 40px;">
			<div class="text" style="position:absolute; left:40px"  @click="navigateToPrev">
				<div v-if="prevSibling"><span>←</span>{{prevSibling.name}}</div>
			</div>
			<div class="text" style="position:absolute; right:0" @click="navigateToNext">
				<div v-if="nextSibling">{{nextSibling.name}}<span>→</span></div>
			</div>
		</div>
	</div>
</template>

<script>
export default {
	props: {
		treeData: {
			type: Array,
			required: true
		},
		active: {
			type: Object,
			default: (() => { })
		},
	},
	data(){
		return{
			prevSibling:null,
			nextSibling:null,
			activeItem:{},
			navList:[]
		}
	},
	// 监听点击的值
	watch: {
		active: {
			handler(newVal,oldVal) {
				if(newVal.id){

					this.activeItem = newVal
					this.handleGetTreeData()

				}
				else{
					return
				}
			},
			deep: true,
			immediate: true
		}
	},
	methods: {
	handleGetTreeData() {
    	let prevSibling = null;
    	let nextSibling = null;
    	function findNearestSiblings(tree, targetId) {
        for (const node of tree) {
            if (node.children) {
                for (let i = 0; i < node.children.length; i++) {
                    const child = node.children[i];
                    if (child.id === targetId) {
                        if (i > 0) {
                            prevSibling = node.children[i - 1];
                        }
                        if (i < node.children.length - 1) {
                            nextSibling = node.children[i + 1];
                            return; // 找到直接兄弟节点，结束搜索
                        }
                        // 如果当前节点没有直接兄弟，继续在同级节点中寻找
                        break;
                    }
                }
            }
            if (prevSibling || nextSibling) return; // 已找到兄弟节点，结束递归
            // 在同级节点中未找到，尝试父节点的前一个和后一个同级节点
            if (node.id !== targetId) {
                findNearestSiblings(node.children || [], targetId);
            }
        }
    }

    findNearestSiblings(this.treeData, this.activeItem.id);

    // 如果仍没有找到前后兄弟，尝试从根节点层级寻找
    if (!prevSibling) {
        for (const rootNode of this.treeData) {
            if (rootNode.children && rootNode.children[rootNode.children.length - 1].id < this.activeItem.id) {
                prevSibling = rootNode.children[rootNode.children.length - 1];
            }
        }
    }
    if (!nextSibling) {
        for (const rootNode of this.treeData) {
            if (rootNode.children && rootNode.children[0].id > this.activeItem.id) {
                nextSibling = rootNode.children[0];
            }
        }
    }
    console.log("Previous Sibling:", prevSibling);
	this.prevSibling = prevSibling;
    console.log("Next Sibling:", nextSibling);
	this.nextSibling = nextSibling;
},
// 拿到当前所点击数据的索引
handleGetTreeIndex(tree,Active) {
	console.log(tree);
	let PIndex = 0
	let CINdex = 0;
	let obj = {}
	tree.forEach((item,index) => {
		item.children.find((item1,index1) => {
				if(item1.id == Active.id){
					PIndex = index
					CINdex = index1
					obj = item1

				}
		});
	});
	this.$emit('handleGetTreeIndex1',PIndex,CINdex,obj)
},
navigateToPrev() {
      if (this.prevSibling) {

		this.activeItem = this.prevSibling
		this.handleGetTreeData()
		this.handleGetTreeIndex(this.treeData,this.activeItem)
      }
    },

    navigateToNext() {
      if (this.nextSibling) {
		this.activeItem = this.nextSibling
		this.handleGetTreeData()
		this.handleGetTreeIndex(this.treeData,this.nextSibling)
      }
    },

	},
	mounted() {
		this.handleGetTreeData()
	}
}
</script>

<style lang="scss" scoped>
.text{
	font-size: 1.1em;
	color: #3eaf7c;
	cursor: pointer;
	span{
		color:#000;
		padding:0 10px;
	}
}
</style>